<!DOCTYPE html>
<html >
<head>
  <meta charset="UTF-8">
  <title>HTML5 Canvas文字粒子动画DEMO演示</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>
  <canvas id="canvas"></canvas>

<div id="interface">
  <h1>Text particle</h1>
<p>feel free to change the value of the variable "message" </p>

Message:
<input id="message" type="text" value="html5tricks" onchange="change()">
Gravity:
<input onchange="changeV()" type="range" id="2" value="0" max="1" min="-1" step="0.1">

Duration:
<input onchange="changeV()" type="range" id="3" value=".4" max="0.99" min="0.1" step="0.01">
  
  Speed:
<input onchange="changeV()" type="range" id="5" value=".1" max="5" min="0" step="0.01">
    Radius:
<input onchange="changeV()" type="range" id="6" value="2" max="20" min="1.8" step="0.1">
Resolution:
<input type="range" id="4" value="5" max="20" min="3" step="1" onchange="change()">
  
</div>
  
    <script  src="js/index.js"></script>

</body>
</html>
